<html>

<head>
    <title>grapecity_spreadJS_demo</title>
    <script src="jquery_3.1.1.min.js" type="text/javascript"></script>
    <link rel="stylesheet" href="gc.spread.sheets.excel2013white.14.2.2.css" type="text/css">
    <script src="gc.spread.sheets.all.14.2.2.min.js" type="text/javascript"></script>
    <script src="gc.spread.excelio.14.2.2.min.js" type="text/javascript"></script>
    <script src="https://cdn.grapecity.com.cn/spreadjs/scripts/FileSaver.min.js" type="text/javascript"></script>
    <script src="gc.spread.sheets.resources.zh.14.2.2.min.js" type="text/javascript"></script>
    <script src="gc.spread.sheets.print.14.2.2.min.js" type="text/javascript"></script>
    <script src="gc.spread.sheets.pdf.14.2.2.min.js" type="text/javascript"></script>
    <script src="gc.spread.sheets.charts.14.2.2.min.js" type="text/javascript"></script>
    <script src="v14.js" type="text/javascript"></script>
    <style type="text/css">
        #ss {
            height: 400px;
            width: 100%
        }
        p{
            text-align: center;
            color: #336699;
        }
    </style>
</head>

<body>
    <p>自定义工作表Tab右键删除功能</p>
    <div id="ss"></div>
    <script type="text/javascript">
        // Title：自定义表单名区域右键菜单
        // Description：自定义表单名区域右键菜单，点击删除会打印信息
        // Tag：自定义右键菜单、表单名
        GC.Spread.Common.CultureManager.culture('zh-cn');
        
        $(document).ready(function() {
            var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
            var sheet = spread.getActiveSheet();
            sheet.setArray(0, 0, [
                [1, 3, 2, 4],
                [2, 3, 2, 5],
                [2, 5, 3, 2]
            ])
            sheet.getRange(1, 0, 1, 4).backColor("red");
            sheet.getRange(3, -1, 1, -1).backColor("yellow");
            sheet.addSpan(1, 0, 1, 2)
        
            var deleteSheetCommand = {
                canUndo: true,
                name: "deleteSheetCommand",
                execute: function(context, options, isUndo) {
        
        
                    options.cmd = "gc.spread.contextMenu.deleteSheet";
                    console.log("do Some thing here~", options)
                    context.commandManager().execute(options);
                    options.cmd = "deleteSheetCommand";
                    return true;
        
                }
            };
        
            spread.commandManager().register("deleteSheetCommand", deleteSheetCommand);
        
            function MyContextMenu() {}
            MyContextMenu.prototype = new GC.Spread.Sheets.ContextMenu.ContextMenu(spread);
            MyContextMenu.prototype.onOpenMenu = function(menuData, itemsDataForShown, hitInfo, spread) {
                itemsDataForShown.forEach(function(item, index) {
                    if (item && item.name === "gc.spread.deleteSheet") {
                        item.command = "deleteSheetCommand"
                    }
                });
            };
            var contextMenu = new MyContextMenu();
            spread.contextMenu = contextMenu;
        
        
        
        
        });
    </script>
</body>

</html>